<template>
	<view class="followplayer">
		<video 
		id="myVideo"
		class="video" 
		objectFit="cover" 
		:src="'http://127.0.0.1:8000/'+item.src" 
		:controls="false"
		loop="true"
		>
			<cover-view @click="click" class="icon iconfont icon-aixin"></cover-view>
		</video>
	</view>
</template>

<script>
	export default {
		props:['item','index'],
		name:"followPlayer",
		data() {
			return {
				Play:false
			};
		},
		onReady() {
			this.videoContext=uni.createVideoContext('myVideo',this)
			if(this.index===0){
				this.play()
			}
		},
		methods:{
			play(){
				if(this.Play===false){
					this.videoContext.play()
				}
				this.Play=true
			},
			pause(){
				if(this.Play===true){
					this.videoContext.pause()
				}
				this.Play=false
			},
			click(){
				if(this.Play===true){
					this.videoContext.pause()
					this.Play=false
				}else{
					this.videoContext.play()
					this.Play=true
				}
			}
		}
	}
</script>

<style>
.followplayer{
	height: 100%;
	width: 100%;
}
.video{
	width: 80%;
	height: 100%;
	z-index: 19;
	position: relative;
}
.icon{
	position: absolute;
	bottom: 10px;
	right: 10px;
	color: #FFFFFF;
	font-size: 20px;
	
}
</style>
